<!doctype html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:replace="th/m/include/head :: head(~{::title}, ~{::style})">
    <meta charset="utf-8">
    <title>[[${appName}]]</title>
    <style>
        .icon {
            width: 1em;
            height: 1em;
            vertical-align: -0.15em;
            fill: currentColor;
            overflow: hidden;
            font-size: 42px;
        }

        .mui-plus.mui-android header.mui-bar {
            display: none;
        }

        .mui-plus.mui-android .mui-bar-nav ~ .mui-content {
            padding: 0;
        }

        .mui-slider-indicator {
            bottom: 0;
        }

        .mui-slider {
            background-color: #f2f2f2;
        }

        .app-icon img {
            width: 60px;
            height: 60px;
        }
    </style>
    <script src="../fonts/mobile/iconfont.js"></script>
</head>
<body>
<div class="mui-content">
    <div id="Gallery" style="margin-top: 0px;">
        <ul class="mui-table-view mui-grid-view mui-grid-9">
            <th:block th:each="json, stat : ${aryIcons}">
                <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
                    <a th:href="${json.url}">
                    <span class="mui-icon app-icon">
                        <span th:id="${json.liId}" class="mui-badge mui-badge-danger"
                              th:style="${json.isBadge ? '' : 'display:none'}"></span>
                        <img th:src="'../' + ${json.imgUrl}"/>
                    </span>
                        <div class="mui-media-body">[[${json.mName}]]</div>
                    </a>
                </li>
            </th:block>
        </ul>
    </div>
</div>
<div th:replace="th/m/include/navbar :: nav(${nav}, false, '', true)"></div>
<script th:inline="javascript">
    $.ajax({
        type: "post",
        url: "../public/android/getBadgeNum.do",
        data: {
            skey: [[${skey}]]
        },
        dataType: "html",
        beforeSend: function (XMLHttpRequest) {
        },
        success: function (data, status) {
            data = $.parseJSON(data);
            var waitCount = data.waitNum;
            var unReadCount = data.messageNum;
            if (waitCount > 0) {
                $('#liWaitCount').html(waitCount);
            } else {
                $('#liWaitCount').hide();
            }
            if (unReadCount > 0) {
                $('#liUnreadCount').html(unReadCount);
            } else {
                $('#liUnreadCount').hide();
            }
        },
        complete: function (XMLHttpRequest, status) {
        },
        error: function (XMLHttpRequest, textStatus) {
            alert(XMLHttpRequest.responseText);
        }
    });
</script>
</body>
</html>